<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">
<style>
    .form-group{
        margin-bottom: 0;
    }
</style>
<head th:include="include/head">

</head>

<body class="hold-transition sidebar-mini layout-fixed">
<div class="wrapper">


    <div class="content-wrapper">
        <!-- Content Header (Page header) -->
        <section class="content-header">
            <div class="container-fluid">
                <div class="row mb-2">
                    <div class="col-sm-6">
                        <h1>分类信息</h1>
                    </div>
                    <div class="col-sm-6">
                        <ol class="breadcrumb float-sm-right">
                            <li class="breadcrumb-item"><a href="#">首页</a></li>
                            <li class="breadcrumb-item active">分类信息</li>
                        </ol>
                    </div>
                </div>
            </div>
            <!-- /.container-fluid -->
        </section>
        <section class="content">
            <form id="fileupload" th:action="@{/common/upload}" method="post"
                  style="display: none;">
                <input type="hidden"  id="type" />
                <input type="file" name="file" id="file" />
            </form>
            <form class="form-horizontal" id="form" method="post"
                  enctype="multipart/form-data" th:action="@{/category/save}">

                <div class="card card-info">

                    <div class="card-header">
                        <h3 class="card-title">基本信息</h3>
                    </div>


                    <input type="hidden" name="cateId" id="cateId" th:value="${bean.cateId}" />
                    <div class="card-body">
                        <div class="form-group row">
                            <label for="cateName" class="col-sm-2 col-form-label">分类名称</label>
                            <div class="col-sm-10">
                                <input type="text" class="form-control" name="cateName" required="required"
                                       id="cateName" aria-required="true" th:value="${bean.cateName}">
                                <label class="help-block m-b-none" for="cateName"
                                       id="cateName-error"><i class="far fa-bell"></i>必填项</label>
                            </div>
                        </div>
                        <div class="form-group row">
                            <label for="cateType" class="col-sm-2 col-form-label">分类</label>
                            <div class="col-sm-10">
                                <select  class="form-control"   id="cateType" name="cateType"  required>
                                    <option   th:selected="1==${bean.cateType}" value="1">资讯</option>
                                    <option   th:selected="2==${bean.cateType}" value="2">相册</option>
                                    <option   th:selected="3==${bean.cateType}" value="3">活动</option>
                                </select>
                                <label class="help-block m-b-none" for="cateType"
                                       id="projectId-error"><i class="far fa-bell"></i>必填项</label>
                            </div>
                        </div>
                        <div class="form-group row">
                            <label for="cateOrder" class="col-sm-2 col-form-label">排序</label>
                            <div class="col-sm-10">
                                <input type="text" class="form-control" name="cateOrder" required="required"
                                       id="cateOrder" aria-required="true" th:value="${bean.cateOrder}">
                                <label class="help-block m-b-none" for="cateOrder"
                                       id="cateOrder-error"><i class="far fa-bell"></i>必填项</label>
                            </div>
                        </div>

                        <div class="form-group row">
                            <label for="cateState" class="col-sm-2 col-form-label">状态</label>
                            <div class="col-sm-10">
                                <input type="checkbox" class="js-switch" id="state3"  th:checked="${bean.cateState}==1"  />
                                <input type="hidden" id="cateState" name="cateState" th:value="${bean.cateState}">
                            </div>
                        </div>
                    </div>
                </div>


            </form>
            <!-- /.card-body -->
            <div class="card-footer">
                <button type="button" class="btn btn-info" onclick="validaBef();">保存</button>
                <button type="button" class="btn btn-default float-right" id="back">取消</button>
            </div>
            <!-- /.card-footer -->

    </div>
    </section>

</div>
<!-- ./wrapper -->
<div th:include="include/foot"></div>

<script>
    var issubmit=false;
    function dosubmit(){
        if(issubmit==false){
            issubmit=true;
            return true;
        }else{
            return false;
        }
    }
    $(document).on("click",".del",function() {
        $(this).parent().parent().remove();

    });
    $(document).on("click",".delfilediv",function() {
        $(this).parent().remove();

    });
    $("#addex").click(function(){
        let  id=$('#id').val();
        console.log(id)
        // return;
        layer.open({
            type: 2,
//		        closeBtn:0,
            title: false,
            area: ['50%', '95%'],
            content: 'select_experts?id='+id,
        });
    });
    $("#addPic").click(function(){
        $("#file").click();
    });
    $("#back").click(function() {
        location.href = 'list';
    });
    $("#file").change(function(e){
        if($(this).val()!=''){
            $("#fileupload").ajaxSubmit({
                success:function(e){
                    console.log(e);
                    if(e.res){
                        $('.filediv').each(function(i,e){
                            if(i>0){
                                $(e).remove();
                            }
                        });
                        let filediv= $(".filediv:eq(0)");
                        let filedivclone=filediv.clone(true);
                        filedivclone.find('img').attr('src',e.url);
                        filedivclone.find('input').attr('name','picUrl');
                        filedivclone.find('input').attr('value',e.url);
                        filedivclone.show();
                        filedivclone.appendTo(filediv.parent());
                        $("#file").val("")
                    }

                },error:function(e){
                    layer.msg(e.responseText, {icon: 5});
                }
            });
        }

    });
    // 	var elem = document.querySelector('.js-switch');
    // 	var switchery = new Switchery(elem, { color: '#1AB394' });
    var elems = Array.prototype.slice.call(document.querySelectorAll('.js-switch'));
    elems.forEach(function(html) {
        var switchery = new Switchery(html, { color: '#1AB394' });
    });

    $.validator.setDefaults({
        ignore: "",
        highlight : function(a) {
            $(a).removeClass("is-valid").addClass("is-invalid");
        },
        success : function(a) {
            $(a).prev().removeClass("is-invalid").addClass("is-valid");
            $(a).html('<i class="fas fa-check"></i>验证成功');
        },
        errorClass : "help-block m-b-none",
// 			validClass : "help-block m-b-none",
        errorPlacement : function(a, b) {
            if (b.is(":radio") || b.is(":checkbox")) {
                a.appendTo(b.parent().parent().parent())
            } else {
                a.appendTo(b.parent())
            }
        },
        submitHandler:function(form){

            form.submit();
        }
    });
    $.validator.addMethod("checkFile",function(value,element){
        let files=$("input[name='fileurls']");
        if(files.length==0){
            return true;
        }
        return false;
    },"");
    $.validator.addMethod("checkCode", function(value, element) {
        console.log(value)
        if (value == '') {
            return true;
        }
        let result = false;
        let id = $("#baseId").val();
        $.ajax({
            url : 'checkCode?id=' + id + '&code=' + value+ '&type=' + 1,
            async : false,
            success : function(e) {
                result = e.res;
            },error:function(e){
                layer.msg(e.responseText, {icon: 5});
            }
        });
        return result;
    }, "");
    $.validator.addMethod("checkName", function(value, element) {
        console.log(value)
        if (value == '') {
            return true;
        }
        let result = false;
        let id = $("#baseId").val();
        $.ajax({
            url : 'checkCode?id=' + id + '&code=' + value+ '&type=' + 2,
            async : false,
            success : function(e) {
                result = e.res;
            },error:function(e){
                layer.msg(e.responseText, {icon: 5});
            }
        });
        return result;
    }, "");
    $.validator.addMethod("mobile", function(value, element) {
        var myreg=/^[1][3,4,5,6.7,8,9][0-9]{9}$/;
        var length = value.length;
        return this.optional(element) || (length == 11 && myreg.test(value));
    }, "手机号码格式错误!");
    $("#form").validate(
        {
            ignore : "",
            rules : {
                doctorPhone: {
                    required:true,
                    mobile:true
                },
                baseName : {
                    required:true,
                    checkName : true
                },
                cateOrder : {
                    required:true,
                    maxlength:20
                },
                attrs : {
                    required:true
                },

            },
            messages : {
                baseName : {
                    required : '<i class="far fa-times-circle"></i>请输入基地名称',
                    checkName : '<i class="far fa-times-circle"></i>基地名称已存在'
                },
                cateOrder : {
                    required : '<i class="far fa-times-circle"></i>请输入排序',
                    maxlength : '代码最大长度为{0}'
                },
                goodsName : '<i class="far fa-times-circle"></i>请输入商品名称',
                filehidden : '<i class="far fa-times-circle"></i>请上传图片',
                attrs : '<i class="far fa-times-circle"></i>请选择关联专家',
            }
        });
    function validaBef(){


        if($("#state3").prop("checked")){
            $("#cateState").val("1");
        }else{
            $("#cateState").val("0");
        }
        let code=$('.textarea').summernote('code');
        $(".textarea").val(code);
        $("#checkItems").val($('.specsItem:checked').map(function(){return this.value}).get().join(','));
        let file=$("input[name='picUrl']").map(function(){return this.value}).get().join(',');
        $("#filehidden").attr('value',file);
        if ($("input[name='eId']").length>0){
            $("#attrs").attr('value',$("input[name='eId']").length);
        }


        if($("#form").validate()){
            if(dosubmit()){
                $("#form").submit();
            }
            setTimeout(function () {
                issubmit=false
            }, 3000);
        }

    }
    $(document).ready(function (){
        $("#hospitalId").change(function (){
            let v=$(this).val();
            let t= $(this).find("option:selected").text();
            if(v>0){
                $("#hospitalName").val(t);
            }
            $.ajax({url:'../doctor/departmentList',data:"hospitalId="+v,success:function (data){
                    if(data.res){
                        $("#departmentId").empty();
                        $("#departmentId").append("<option value='-1'>请选择科室</option>");
                        for(let i=0;i<data.list.length;i++){
                            console.log(data.list[i])
                            $("#departmentId").append("<option value='"+data.list[i].id+"'>"+data.list[i].departmentName+"</option>");
                        }

                    }
                }})
        });
        $("#departmentId").change(function (){
            let v=$(this).val();
            let t= $(this).find("option:selected").text();
            console.log(v,t)
            if(v>0){
                $("#departmentName").val(t);
            }

        });
        $("#doctorTitlesId").change(function (){
            let v=$(this).val();
            let t= $(this).find("option:selected").text();
            if(v>0){
                $("#doctorTitlesName").val(t);
            }
        });
        $("#detailAddress").click(function (){
            $("#mapDiv").show();
        });
    });

    window.addEventListener('message', function(event) {
        // 接收位置信息，用户选择确认位置点后选点组件会触发该事件，回传用户的位置信息
        let loc = event.data;
        if (loc && loc.module == 'locationPicker') {//防止其他应用也会向该页面post信息，需判断module是否为'locationPicker'
            $("#detailAddress").val(loc.poiaddress+loc.poiname);
            $("#longitude").val(loc.latlng.lng);
            $("#latitude").val(loc.latlng.lat);
            $("#fullAddr").val(loc.poiaddress);
            $("#mapDiv").hide();
        }
    }, false);
</script>
</body>
</html>